<template>
  <page-wrap back hide-tab title="招聘资料" stayStill class="page">
    <view class="wrap">
      <u-tabs-swiper
        ref="uTabs"
        :list="list"
        :current="current"
        :is-scroll="false"
        font-size="28rpx"
        active-color="#ee3c1c"
        gutter="32"
        :bold="false"
        swiperWidth="750"
        @change="tabsChange"
      ></u-tabs-swiper>

      <swiper
        class="swiper-box"
        :current="swiperCurrent"
        @transition="transition"
        @animationfinish="animationfinish"
      >
        <swiper-item class="swiper-item">
          <scroll-view scroll-y style="height: 100%;width: 100%;">
            <basicItem :info="info"></basicItem>
          </scroll-view>
        </swiper-item>
        <swiper-item class="swiper-item">
          <scroll-view scroll-y style="height: 100%;width: 100%;">
            <eduItem :info="edu"></eduItem>
          </scroll-view>
        </swiper-item>
        <swiper-item class="swiper-item">
          <scroll-view scroll-y style="height: 100%;width: 100%;">
            <workItem :info="work"></workItem>
          </scroll-view>
        </swiper-item>
        <swiper-item class="swiper-item">
          <scroll-view scroll-y style="height: 100%;width: 100%;">
            <memberItem :info="family"></memberItem>
          </scroll-view>
        </swiper-item>
        <swiper-item class="swiper-item">
          <scroll-view scroll-y style="height: 100%;width: 100%;">
            <questionItem :info="exam"></questionItem>
          </scroll-view>
        </swiper-item>
      </swiper>
    </view>

    <view class="btn-group">
      <button class="share" open-type="share" v-if="showEntry" @click="handleWeChat"><text class="share-icon"></text>转发给面试官</button>
    </view>
    <u-popup v-model="showShare" mode="bottom" safe-area-inset-bottom>
      <button
        class="share-item u-border-bottom"
        v-for="(item, index) in shareList"
        :key="index"
        :open-type="item.type"
        @click="handleShare(item)"
      >{{ item.text }}</button>
      <button class="share-item close" @click="showShare = false">取消</button>
    </u-popup>
  </page-wrap>
</template>

<script>
import { resume, eduAndTrain, work, family, exam, entryPermission } from "@/api";
import basicItem from "./components/basic";
import eduItem from "./components/edu";
import workItem from "./components/work";
import memberItem from "./components/member";
import questionItem from "./components/question";
import ShareMixin from '@/mixins/share';
export default {
  mixins: [ShareMixin],
  components: {
    basicItem,
    eduItem,
    workItem,
    memberItem,
    questionItem
  },
  data() {
    return {
      resumeId: "",
      info: {
        domicileRegion: "",
        workingYears: "",
        highestEducation: "",
        principalId: "",
        recommend: "",
        recommendName: "",
        bloodType: "",
        idNumber: "",
        salaryExpectation: "",
        sufferMajorDiseases: "",
        principal: "",
        sufferedMajorDiseases: "",
        domicileAddress: "",
        resumeId: "",
        school: "",
        arrivalTime: "",
        tel: "",
        email: "",
        birthDay: "",
        address: "",
        politicalStatus: "",
        sex: "",
        intendedPosition: "",
        nationality: "",
        createTime: "",
        name: "",
        nativePlace: "",
        personId: "",
        region: "",
        maritalStatus: ""
      },
      edu: {},
      work: {},
      family: {},
      exam: {},
      list: [
        { name: "基本资料" },
        { name: "教育经历" },
        { name: "工作经历" },
        { name: "家庭成员" },
        { name: "相关试题" }
      ],
      // 因为内部的滑动机制限制，请将tabs组件和swiper组件的current用不同变量赋值
      current: 0, // tabs组件的current值，表示当前活动的tab选项
      swiperCurrent: 0, // swiper组件的current值，表示当前那个swiper-item是活动的
      shareList: [
        // #ifdef MP-WEIXIN
        {
          text: "转发至微信好友或群聊",
          fcn: this.handleWeChat,
          type: "share"
        }
        // #endif
      ],
      showShare: false,
      loaging: false,
      showEntry: false
    };
  },
  onLoad: function(options) {
    this.getResume(options.resumeId);
    this.resumeId = options.resumeId;
    this.getAuth();
    wx.hideShareMenu();

    this.sharePath = `/pagesSub/userCenter/hrDetail/index?resumeId=${this.resumeId}`;
    this.shareQuery = `resumeId=${this.resumeId}`;
  },
  computed: {
    personId() {
      return uni.getStorageSync("person-id").slice(2) || undefined
    }
  },
  methods: {
    // 招聘资料入口权限 HR
    getAuth() {
      let path = "/pagesSub/public/loginMode/index";
      this.isLogin = !!this.personId;
      if (!this.isLogin) {
        uni.reLaunch({
          url: `${path}?resumeId=${this.resumeId}`
        });
        return false;
      }
      const userInfo = getApp().globalData.userInfo || {shouji: "", name: ""};
      const params = {
        tel: userInfo.shouji,
        name: userInfo.name
      }
      entryPermission(params).then(res =>{
        if(res.data.isShowEntry == 1) {
          this.showEntry = true;
        }
      });
    },  
    handleWeChat() {},
    handlShare(item) {
      this.showShare = false;
      this.$nextTick(item.fcn);
    },
    getResume(resumeId) {
      const params = {
        resumeId: resumeId
      };
      this.loaging = true;
      resume(params).then(res => {
        this.loaging = false;
        this.info = res.data;
        this.shareTitle = `${this.info.name}-应聘资料`;
      }).catch(err =>{
        this.loaging = false;
      });
      eduAndTrain(params).then(res => {
        this.edu = res.data;
      });
      work(params).then(res => {
        this.work = res.data;
      });
      family(params).then(res => {
        this.family = res.data;
      });
      exam(params).then(res => {
        this.exam = res.data;
      });
    },
    // tabs通知swiper切换
    tabsChange(index) {
      this.swiperCurrent = index;
    },
    // swiper-item左右移动，通知tabs的滑块跟随移动
    transition(e) {
      let dx = e.detail.dx;
      this.$refs.uTabs.setDx(dx);
    },
    // 由于swiper的内部机制问题，快速切换swiper不会触发dx的连续变化，需要在结束时重置状态
    // swiper滑动结束，分别设置tabs和swiper的状态
    animationfinish(e) {
      let current = e.detail.current;
      this.$refs.uTabs.setFinishCurrent(current);
      this.swiperCurrent = current;
      this.current = current;
    }
  },
  // onShareAppMessage() {
  //   return {
  //     title: `${this.info.name}-应聘资料`,
  //     path: `/pagesSub/userCenter/hrDetail/index?resumeId=${this.resumeId}`
  //   };
  // },
  // onShareTimeline() {
  //   return {
  //     title: `${this.info.name}-应聘资料`,
  //     path: `/pagesSub/userCenter/hrDetail/index?resumeId=${this.resumeId}`
  //   };
  // }
};
</script>

<style lang="scss" scoped>
$img-base-person: $img-base + "pcenter/";
.swiper-box {
  flex: 1;
  height: 1rpx;
}
.wrap {
  flex-grow: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  height: 1rpx;
}
.btn-group {
  margin: 0 32rpx 32rpx;
  .share {
    height: 80rpx;
    background-image: linear-gradient(-45deg, #FF5637 0%, #FF7F4E 100%);
    border-radius: 10rpx;
    color: #fff;
  }
  .share-icon {
    display: inline-block;
    background: url($img-base-person + "share.png") no-repeat center / 100% 100%;
    width: 28rpx;
    height: 28rpx;
    margin-right: 18rpx;
  }
}
</style>